<template>
    <el-form ref="form" :model="curData" label-width="100px" :inline="true" :rules="rules" status-icon>
        <template v-if="curData.parentId && curData.parentId != '0'">
            <el-form-item label="父字典项:" prop="parentName" size="small">
                <el-select v-model="curData.parentId" placeholder="请选择父字典项" size="small" disabled>
                    <el-option v-for="(item,index) in pDics" :label="item.label" :value="item.value"
                               :key="index"></el-option>
                </el-select>
            </el-form-item>
        </template>
        <el-form-item label="编码:" prop="code">
            <el-input v-model.trim="curData.code" placeholder="请输入编码" size="small"></el-input>
        </el-form-item>
        <el-form-item label="名称:" prop="name">
            <el-input v-model.trim="curData.name" placeholder="请输入名称" size="small"></el-input>
        </el-form-item>
        <template v-if="!curData.parentId || curData.parentId == '0'">
            <el-form-item label="字典类型:" prop="type" size="small" class = "formInline">
                <el-radio-group v-model="curData.type">
                    <el-radio :label="1">系统类型</el-radio>
                    <el-radio :label="0">业务类型</el-radio>
                </el-radio-group>
            </el-form-item>
        </template>
        <template v-if="curData.parentId && curData.parentId != 0">
            <el-form-item label="默认项:" prop="isDefault" size="small" class = "formInline">
                <el-radio-group v-model="curData.isDefault">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                </el-radio-group>
            </el-form-item>
        </template>
        <el-form-item label="状态:" prop="enabled" size="small" class = "formInline">
            <el-switch v-model="curData.enabled" active-color="#13ce66" :active-value="+enableds[0].value"
                       :inactive-value.number="+enableds[1].value"></el-switch>
        </el-form-item>
        <el-form-item label="排序:" prop="sort" size="small">
            <el-input v-model.number.trim="curData.sort" placeholder="请输入排序" size="small"></el-input>
        </el-form-item>
        <el-col :span="24">
            <el-form-item label="备注:" prop="remark" size="small" class="formBlock">
                <el-input v-model.trim="curData.remark" size="small" type="textarea"
                          :autosize="{ minRows: 2, maxRows: 4}"
                          maxlength="30"
                          show-word-limit></el-input>
            </el-form-item>
        </el-col>
        <el-form-item class="formBtn">
            <el-button type="info" @click="handleCancel" size="medium">取消</el-button>
            <el-button type="primary" @click="handleSubmit" size="medium">确定</el-button>
        </el-form-item>
    </el-form>
</template>

<script>
    import edtiMixin from '@/mixins/edit.mixin'
    import rules from './rules';
    import {mapActions, mapMutations, mapState} from 'vuex'
    export default {
        mixins: [edtiMixin],
        data() {
            return {
                rules: rules(this),
                addApi: this.$api.system.dic.add,
                editApi: this.$api.system.dic.edit
            }
        },
        computed: {
            ...mapState('basic', ['pDics']),
            ...mapState('dic', ['enableds'])
        },
        methods: {
            ...mapActions('basic', ['doPDicOfBasic']),
            ...mapActions('dic', ['doEnabledOfBasic']),
        },
        mounted() {
            this.doPDicOfBasic();
            // 数据字典启停状态
            this.doEnabledOfBasic();
        }
    }
</script>

<style scoped lang="less">
    @import "../../../assets/css/common.less";

    /deep/ .el-select {
        width:200px!important;
    }

</style>
